import { NavLink, Switch, Redirect, Route } from "react-router-dom";
function UserHome() {
  return <h3>User Home</h3>;
}
function UserSettings() {
  return <h3>User Settings</h3>;
}

function User(props) {
  console.log("🚀 ~ User ~ props:", props);
  // console.log("🚀 ~ User ~ history:", history);
  return (
    <div>
      <h4>User</h4>
      <button onClick={() => props.history.push("/")}>Home</button>
      <div>
        <div>
          <NavLink to="/user/profile">Profile</NavLink> |
          <NavLink to="/user/settings">Settings</NavLink>
        </div>
        <div>
          <Switch>
            <Redirect from="/user" to="/user/profile" exact />
            <Route path="/user/profile" component={UserHome} />
            <Route path="/user/settings" component={UserSettings} />
          </Switch>
        </div>
      </div>
    </div>
  );
}

export default User;
